XxToxic_DollsxX || A VF Cult

Here's a helpful little guide to those of you who wish to spice up your app a bit. HTML isn't required, but it's always nice to see. All of the words in red in the codes are the ones that you replace. I've also included some [tips] in here (hover over the tips to view). Finally, examples will be done in blue and codes will be done in gray.

Spacing[Tip]

Spacing is very important, it helps us know where one paragraph or question ends and the next one starts. Now, there are two types of spacing, a line break and a paragraph break.
The line break is very simple. Just put <br> when you want to jump down a line. Like<br>This

Like
This
The paragraph break is very similar, only it puts an extra line between the two. Just type <p> Where you want it to go to the next paragraph.Like<p>This
Like

This

Centering[Tip]

As you may have already noticed, some of this page is centered. You may want to center part or all of you app, and it is very easy to do so. Just type <center> before the part you want to be centered and </center> after.

Font Basics[Tip]

There are many things that you can do with your font. Here are the most basic styles:

<b>Bolded</b>
<u>Underlined</u>
<i>Italics</i>
<s>Slashed</s>

Font Size[Tip]

You can also change the size of your font. There's about 6 different sizes to choose from, from 1 to 6. The code is very simple: <Font size=SIZE HERE>Text</font>.

<font size=1>Size 1</font>
<font size=2>Size 2</font>
<font size=3>Size 3</font>
<font size=4>Size 4</font>
<font size=5>Size 5</font>
<font size=6>Size 6</font>

Font Coloring[Tip]

Coloring is one major step to add a bit more flavor to your app. The code is very simple, just add the accepted color name or hex code (find the hex code for colors by using the picker below).<font color=Color Code>Text</font>

X

This is a large demo of the color you've selected.

The hex code for this color is:

F1FFCC

Show/ hide Color Picker

Font Types[Tip]

Fonts really add the final touch to anything, and are very easy to use. The code is very simple: <Font face="Font you want">Text</font>. In the scroll box below are a list of different fonts. Their names are in their styles so just copy and paste it in the code.

Agency FB	Arial	Arial Black	Arial Narrow	Arial Rounded MT Bold	Blackadder ITC
Bodoni MT	Bodoni MT Black	Bodoni MT Condensed	Book Antiqua	Bookman Old Style	Bookshelf Symbol 7
Bradley Hand ITC	Calisto MT	Castellar	Century Gothic	Century Schoolbook	Comic Sans MS
Copperplate Gothic Bold	Copperplate Gothic Light	Courier	Courier New	Curlz MT	Edwardian Script ITC
Elephant	Engravers MT	Eras Bold ITC	Eras Demi ITC	Eras Light ITC	Eras Medium ITC
Estrangelo Edessa	Felix Titling	Fixedsys	Forte	Franklin Gothic Book	Franklin Gothic Demi
Franklin Gothic Demi Cond	Franklin Gothic Heavy	Franklin Gothic Medium	Franklin Gothic Medium Cond	French Script MT	Garamond
Gautami	Georgia	Gigi	Gill Sans MT	Gill Sans MT Condensed	Gill Sans MT Ext Condensed Bold
Gill Sans Ultra Bold	Gill Sans Ultra Bold Condensed	Gloucester MT Extra Condensed	Goudy Old Style	Goudy Stout	Haettenschweiler
Impact	Imprint MT Shadow	Kartika	Latha	Lucida Console	Lucida Sans
Lucida Sans Typewriter	Lucida Sans Unicode	Maiandra GD	Mangal	Marlett	Microsoft Sans Serif
Modern	Monotype Corsiva	MS Reference Sans Serif	MS Sans Serif	MS Serif	Myriad Condensed Web
Myriad Web	OCR A Extended	Palace Script MT	Palatino Linotype	Papyrus	Perpetua
Perpetua Titling MT	Pristina	Roman	Rage Italic	Rockwell	Rockwell Condensed
Rockwell Extra Bold	Script	Script MT Bold	Shruti	Small Fonts	Sydnie
Sylfaen	Symbol	System	Tahoma	Terminal	Times New Roman
Trebuchet MS	Tunga	Tw Cen MT	Tw Cen MT Condensed	Tw Cen MT Condensed Extra Bold	Verdana
Vrinda	Webdings	Wingdings	Wingdings 2	Wingdings 3

Combining[Tip]

Want to change the size, color, AND type of font without typing too much. Well just combine the codes you want. It's very simple:<font color=Color Code size=Your size Face="Font Name">Text</font>

Symbols

Symbols can add extra fun to your app. Just type the code for the symbol you want. A list of them are in the table below.

♥	♥	♦	♦	♣	♣	♠	♠
←	←	→	→	↑	↑	↓	↓
†	†	‡	‡	¢	¢	£	£
¤	¤	¥	¥	¦	¦	§	§
¨	¨	©	©	ª	ª	«	«
¬	¬	®	®	¯	¯	°	°
±	±	²	²	³	³	´	´
µ	µ	¶	¶	·	·	¸	¸
º	º	»	»	¼	¼	½	½
¿	†	‡	‡	¢	¿	∞	∞
ƒ	ƒ	™	™	↔	↔	∂	∂
∩	∩	∫	∫	≈	≈	≠	≠
≡	≡	≤	≤	≥	≥	◊	◊
Œ	Œ	œ	œ	Š	Š	„	„
α	α	β	β	γ	γ	δ	δ
ε	ε	ζ	ζ	η	η	θ	θ
ι	ι	κ	κ	λ	λ	μ	μ
ν	ν	ξ	ξ	ο	ο	π	π
ρ	ρ	ς	ς	σ	σ	τ	τ
υ	υ	φ	φ	χ	χ	ψ	ψ
ω	ω	Α	Α	Β	Β	Γ	Γ
Δ	Δ	Ε	Ε	Ζ	Ζ	Η	Η
Θ	Θ	Ι	Ι	Κ	Κ	Λ	Λ
Μ	Μ	Ν	Ν	Ξ	Ξ	Ο	Ο
Π	Π	Ρ	Ρ	Σ	Σ	Τ	Τ
Υ	Υ	Φ	Φ	Χ	Χ	Ψ	Ψ
Ω	Ω

Bullets and List[Tip]

Sometimes, you want to list things and it's always best to have it well organized. Bullets are the easiest way to do so. You can choose between two types of lists; ordered and unordered. For unordered lists, you have three different types of bullets to choose from.

• circle

• disc

• Square

How to make this is simple. Just place which style you want in the code below. <ul type="TYPE OF BULLET"><li>Item one<li>item two</ul>

For ordered lists, it's rather similar only you have more choices and they are as followed:

1. Numbered(type="1")

1. Lowercase letters (type="a")

1. Uppercase letters (type="A")

1. Lowercase numerals (type="i")

1. Uppercase numerals (type-"I">

To use ordered list, do the same thing for the unordered only with this code: <ol type="TYPE DESIRED"><li>item one<li>item two</ol>

You can add more items to your lists simply by adding another <li> in the code.

Images[Tip] Obviously, you're going to use photos. Let's cover some of the basics to posting images.

First and foremost, your image has to be uploaded to the web, either via your profile or a free site like Tinypic.com. Once it's uploaded to the web, you need to get the URL for the image, not the page that it's located on. If you use the image uploading websites, they'll give you the direct URL for your image. If you're getting your pictures from your VF, you'll need to right click on the image, go to properties, and copy the image URL from there.

The basic code to post your image is the following:
<img src="IMAGE URL">

Now, merely posting your image isn't the only thing you can do with it. You can also add a border, add alternate text (in case your image doesn't show), have a hover title, and resize your image. Just take the original code, and add what you would like. The following are the things you can add to your picture.

Width=WIDTH SIZE Height=HEIGHT SIZE Title=" Your message here Alt="Your message here border=desired border size

Make sure that you have a space in between each additional thing. Also, they should not be inside the quotations in the original code.

My final Tip would be, Test your app out in your journal. Alot of times, people make mistakes with their HTML and writing. It's always best to make sure you're app is the way you want it.